class Order extends React.Component {
    constructor(props) {
  super(props);
  this.state = {
    thumburl:'',
    ordernumber:'',
    numbersearch:'',
    name:'',
    showswitch:!0,
    id:'0',
    start:0,
    ishide:'none',
    pagestart:0,
    pagesize:20,
    counts:[],
    statearr:[
        {
            state:'ALL',
            content:'全部'
        },
        {
            state:'SOLVING',
            content:'正在退款处理'
        },
        {
            state:'SOLVED',
            content:'已处理退款'
        },
        {
            state:'RECEIVED',
            content:'已收货'
        },
        {
            state:'SHIPPED',
            content:'已发货'
        },
        {
            state:'CANCELED',
            content:'已取消'
        },
        {
            state:'PAY_SUCCESS',
            content:'已支付'
        },
        {
            state:'NO_PAY',
            content:'未支付'
        },
        ]
    // case 'SOLVING':
    //     content= '退款处理中';
    //     break;
    // case 'RECEIVED':
    //     content= '已收货';
    //     break;
    // case 'SHIPPED':
    //     content= '已发货';
    //     break;
    // case 'CANCELED':
    //     content= '已取消';
    //     break;
    // case 'PAYSUCCESS':
    //     content= '支付成功';
    //     break;
    // case 'NO_PAY':
    //     content= '未支付';
    //     break;
    // case 'SOLVED':
    //     content= '已处理退款';
    //     break;
  };
}

onstatechange(e){
   console.log(e.target.value,'onstatechange');
    this.freshlist(0,e.target.value)
    this.setState({
        zt:e.target.value
    })

}


componentDidMount() {
this.freshlist(0,'ALL');
let statehtml = [];
this.state.statearr.forEach((x,i)=>{
    console.log(x.state,x.content)
    statehtml.push(
        <option key={i} value={x.state}>{x.content}
                        </option>
    )
})
this.setState({statehtml})
}

freshlist(start,state){
    this.setState({
        state:state
    })
    let {pagesize} = this.state,list=[];
    getorderslist(start,pagesize,state,res=>{
        if(res.issuccess==1){
            console.log(res.data)
            if(res.data){
                let pagecount = Math.ceil( res.total/pagesize);
                if(start==0)
                this.setpager(pagecount,start);
                if(state!='ALL'&&state){
                    res.data.forEach(x=>{
                        if(x.state==state){
                            list.push(x)
                        }
                    })
                }else{
                    list = res.data
                }
                this.setlist(list);
                
            }

        }
    })

    

// getcategorylist(res=>{
//     if(res.issuccess){
//         console.log(res.list);
//         var listhtml = [];
//         res.list.forEach((x,i) => {
//             listhtml.push(
//                 <tr key={i}>
//                     <td>{x.name}</td>
//                     <td>{formatDate(new Date( x.updatedate))}</td>
//                     <td className='operate'>
//                     <p className='edit' onClick={this.edit.bind(this,x.id)}>编辑</p>
//                     <p onClick={this.del.bind(this,x.id)}>删除</p>
//                     </td></tr>
//             )
//         });
//         this.setState({list:res.list,listhtml})
//     }
// })
}


todetail(e){
    window.location.href='./orderdetail.html?number='+e
}

setlist(list){
    console.log(list,'list');

    
//     <th>订单编号</th>
// <th>支付金额</th>
// <th>订单状态</th>
    var listhtml = [];
    if(list.length>0){
            list.forEach((x,i) => {
                 x.date = formatDate(new Date(x.createDate)) 
                listhtml.push(
                    <tr key={i}>
                        <td>{x.ordernum}</td>
                        <td>{x.date}</td>
                        <td>{x.iscost!=null?`￥${0}`:`￥${x.cost/100}`}</td>
                        <td>{getstatecontent(x.state)}</td>
                        <td className='operate'>
                        <p className='edit' onClick={this.todetail.bind(this,x.ordernum)}>详情</p>
                        <p onClick={this.del.bind(this,x.ordernum)}>删除</p>
                        {/* <p onClick={this.changes.bind(this,x.ordernum,x.state)}>修改状态</p>
                        <div className="ishide"  id={'ishide'+x.ordernum}>
                            <select value={this.state.cid} onChange={this.changesstate.bind(this)}>
                               <option value="SOLVING">正在退款处理</option>
                               <option value="SOLVED">已处理退款</option>
                               <option value="RECEIVED">已收货</option>
                               <option value="SHIPPED">已发货</option>
                               <option value="CANCELED">已取消</option>
                               <option value="PAY_SUCCESS">已支付</option>
                               <option value="NO_PAY">未支付</option>
                            </select>
                        </div>            */}
                        </td>
                        
                        </tr>
                )
            });
        }else{
            listhtml.push(
                <tr key='0'>暂无数据</tr>
            ) 
        }
            this.setState({list,listhtml})
}

setpager(pagecount,start){
    let counts= [];
        for (let i = 1; i < pagecount+1; i++) {
        counts.push(start+i)
    }
    
    this.setState({counts})
}

clickpage(e){
    console.log('clickpage',e);
    let {pagesize,counts,state} = this.state,start = pagesize*(counts[e]-1);
    this.setState({pagestart:e})
    this.freshlist(start,state)
    
    }

add(){
  this.setState({clicknew:!0,id:'0'})
}
inputchange(e){
this.setState({name:e.target.value})
}
// clickupload(){
// $('#file').click();
// }
del_detail_img(){
this.setState({finishupload:!1,thumburl:''})
}

upload(){
  var that = this;
  var thumburl = this.state.thumburl;
  if(!isBase64(thumburl)){
      alert('请先选择图片')
      return;
  }
// uploadimg(thumburl,res=>{
//     that.setState({
//     finishupload:!0,
//     thumburl:`${API_HEAD}imgs/${res.path}`
//   })
// })

}

edit(e){
var list = this.state.list;
var item = {};
list.forEach(x => {
    if(x.id==e){
        this.setState({
            thumburl:x.picpath,
            name:x.name,
            id:x.id,
            clicknew:!0,
            finishupload:!0
        })
    }
});
}
del(e){
  this.setState({ordernumber:e})
  $('#myModal').modal('toggle');
}
changes(ordernumber,state){
  
    var e = ordernumber;
    this.setState({
        ordernumber:e
    })
    $('#ishide'+e).toggle();
    // console.log(ordernumber,state)
}
// changesstate(e){
//     var {ordernumber,zt} =this.state;
//     var state= e.target.value;
//     // console.log(ordernumber,state);
//     changesorder(ordernumber,state,res=>{
//         if(res.issuccess=='1'){
//             alert('修改成功');
          
//             this.freshlist(this.state.start,state=zt);
//               $('#ishide'+ordernumber).hide();
//         }
//     })
// }
searchinput(e){
    this.setState({ordernumber:e.target.value})
    

}
search(){
    let {ordernumber} = this.state;
    if(ordernumber.length==0) return;
    getordersbynumber(ordernumber,res=>{

        if(res.issuccess=='1'){
            if(res.list){
                this.setlist(res.list);
                this.setState({showswitch:!1})
            }
          
        }
    })

}
reset(){
    this.setState({numbersearch:'',showswitch:!0})
    this.freshlist(0,'ALL');
}

confirmdel(){
    var {state} =this.state;
    console.log(state)
  delorder(this.state.ordernumber,res=>{
      if(res.issuccess==1){
          $('#myModal').modal('toggle');
                  alert('删除成功')
                  this.setState({
                      clicknew:!1,
                      finishupload:!1,
                      name:'',
                      thumburl:''
                  })
                  this.freshlist(this.state.start,state);
              
      }
  })

}



     render() {
         let {pagestart,counts,listhtml,ordernumber,showswitch}  = this.state;

            return(

                <div className='content_wrap panel-default content_wrap'>
            <Modal content='确定删除吗？' click={this.confirmdel.bind(this)}/>
                    <div className='breadLine '> 
                        当前位置 > 订单管理 
                        </div>
                    <div className='inputs panel-body'>
                        <h3 style={{marginBottom:"10px"}}>订单管理</h3>
                        <div className='search'>
                            <div className='number'>
                        <input onChange={this.searchinput.bind(this)} placeholder='输入订单编号' value={ordernumber}/>
                        <p className='btn add btn-primary center' onClick={this.search.bind(this)}>查询</p>
                        <p style={{marginLeft:'10px'}} className='btn add btn-success center' onClick={this.reset.bind(this)}>返回</p>
                            </div>

                            <div style={{display:showswitch?"":"none"}} className='state'>
                                <p>选择状态:</p>
                            <select value={this.state.cid} onChange={this.onstatechange.bind(this)} className="form-control select">
                                {this.state.statehtml}
                            </select>
                            </div>
                        </div>
                        
<table className="table table-hover">
<thead>
<tr>
<th>订单编号</th>
<th>订单创建时间</th>
 <th>支付金额</th>
<th>订单状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{listhtml}
</tbody>
</table>
                 
                </div>
                <Pager counts={counts} click={this.clickpage.bind(this)} index={pagestart}/>
                </div>
            )
        }
    }





ReactDOM.render(
    <div>
        <TopLine />
        {/* <LeftMenu code='6'/> */}
        <LeftMenu code='order'/>
        <Order/>
        
        </div>
            //<Barrage/>
,$('.container')[0]
)